import React from 'react';
import { inject, observer } from 'mobx-react';
import { toJS } from 'mobx'
import { withRouter } from 'react-router-dom';
import { Tools } from 'weaver-mobile';
import WrOperateLog from '../../../../public/log'

const getLabel = Tools.getLabel

@inject("taskDetailOperateLogStore")
@withRouter
@observer
class OperateLog extends React.Component {

    constructor(props) {
        super(props)
        this.state = {
            ...props
        }
    }

    componentWillMount() {
        const { taskid } = this.state
        const { changeTaskid, changeDatas, changeLastcount, changeLastid, getTaskLog } = this.props.taskDetailOperateLogStore
        changeTaskid(taskid)
        getTaskLog()
    }

    componentWillUnmount() {
        this.clear()
    }

    //下拉刷新
    handleLogRefresh = () => {
        const { logStore, getTaskLog } = this.props.taskDetailOperateLogStore
        this.clear()
        getTaskLog(true)
    }

    //底部加载
    handleLogEndReached = () => {
        const { getTaskLog } = this.props.taskDetailOperateLogStore
        getTaskLog()
    }

    clear = () => {
        const { logStore, changeDatas, changeLastcount, changeLastid } = this.props.taskDetailOperateLogStore
        // logStore.clearData()

        changeDatas([])
        changeLastcount(0)
        changeLastid("")
    }

    render() {
        const { datas, logStore } = this.props.taskDetailOperateLogStore
        return (
            <div className="workrelate-mobile-task-operate-log-wrapper">
                <WrOperateLog
                    logStore={logStore}
                    handleRefresh={this.handleLogRefresh}
                    handleEndReached={this.handleLogEndReached}
                    customHeight={window.innerHeight - 55}
                />
            </div>
        )
    }
}

export default OperateLog
